<div class="modal-content">
    <header class="modal-header" data-test-modal="verify-email">
        <h1>Verifying email address</h1>
    </header>
    <button type="button" class="close" role="button" title="Close" {{on "click" @close}}>{{svg-jar "close"}}<span class="hidden">Close</span></button>

    <div class="modal-body">
        {{#if this.verifyEmailTask.isRunning}}
            <div class="flex justify-center flex-auto">
                <div class="gh-loading-spinner"></div>
            </div>
        {{else if this.email}}
            <p>
                Success! The support email address has changed to <strong>{{this.email}}</strong>
            </p>
        {{else if this.error}}
            <p>Verification failed:</p>
            <p>{{this.error}}</p>
        {{/if}}
    </div>

    <div class="modal-footer">
        <button
            type="button"
            class="gh-btn"
            {{on "click" @close}}
            {{on-key "Enter"}}
        >
            <span>Ok</span>
        </button>
    </div>
</div>
